<template>
  <a-layout id="components-layout-demo-side" style="min-height: 100vh">
    <a-layout-sider v-model="collapsed" collapsible>
      <div class="logo" />
      <NavMenu/>
    </a-layout-sider>
    <a-layout>
      <a-layout-header style="background: #fff;font-size: 20px;display: flex; padding: 0">
		  <div class="header">
			  游戏后台管理系统
		  </div>
		  <div class="header_right">
			  欢迎，{{user}}
			  <span style="margin-left: 12px;">
				  <a href="">安全退出</a>
			  </span>
		  </div>
	  </a-layout-header>
      <a-layout-content style="margin: 10px 10px">
        <div :style="{ padding: '24px', background: '#fff', minHeight: '90vh' }">
          <router-view></router-view>
        </div>
      </a-layout-content>
    </a-layout>
  </a-layout>
</template>
<script>
import NavMenu from "../components/navmenu/NavMenu.vue"
export default {
  components:{NavMenu},
  data() {
    return {
	  collapsed: false,
	  user:"admin"
    };
  },
};
</script>

<style>
#components-layout-demo-side .logo {
  height: 32px;
  background: rgba(255, 255, 255, 0.2);
  margin: 16px;
}
.header{		
	color: aqua;
	margin-left: 20px;
}
.header_right{
  position: absolute;
  right: 30px;
}
</style>